<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no">
    <title>Title</title>
    <link rel="stylesheet" href="css/animate.min.css">
    <link rel="stylesheet" href="css/swiper.min.css">
    <link rel="stylesheet" href="css/index.css">
</head>
<body>

<img class="music_btn" src="images/musicBtn.png" alt="dad">

<div class="swiper-container">

    <div class="swiper-wrapper">
        <div class="swiper-slide page1">
            <div class="index-text ">
                <img class="ani" swiper-animate-effect="fadeInUp" swiper-animate-duration="0.3s" swiper-animate-delay="0.2s" src="images/indexTxt.png" alt="">
                <img class="ani" swiper-animate-effect="fadeInUp" swiper-animate-duration="0.5s" swiper-animate-delay="0.3s" src="images/indexFlowers01.png" alt="">
                <img class="ani" swiper-animate-effect="fadeInUp" swiper-animate-duration="0.5s" swiper-animate-delay="0.5s" src="images/indexFlowers02.png" alt="">
            </div>
            <div class="index-flight ani"  swiper-animate-effect="zoomInDown" swiper-animate-duration="0.5s" swiper-animate-delay="1.1s">
                <img class="ani index-flight infinite"  swiper-animate-effect="pulse" swiper-animate-duration="1s" swiper-animate-delay="1.1s" src="images/indexFlight.png" alt="">
            </div>
            <div class="index-build ani" swiper-animate-effect="fadeIn" swiper-animate-duration="0.5s" swiper-animate-delay="0.1s">
                <img class="index-build" src="images/indexBuilding.png" alt="">
            </div>
            <div class="index-bg ani "swiper-animate-effect="zoomIn" swiper-animate-duration="0.5s" swiper-animate-delay="1s">
                <img class="index-bg ani infinite" src="images/indexCloud.png" alt="" swiper-animate-effect="pulse" swiper-animate-duration="0.8s" swiper-animate-delay="1s">
                <img class="index-bg  ani infinite" src="images/indexStars.png" alt="" swiper-animate-effect="pulse" swiper-animate-duration="1s" swiper-animate-delay="1s">
                <img class="index-bg ani infinite" src="images/indexElements.png" alt="" swiper-animate-effect="pulse" swiper-animate-duration="0.6s" swiper-animate-delay="1s">
            </div>
            <div class="index-up ani infinite" swiper-animate-effect="bounceInUp" swiper-animate-duration="2s" swiper-animate-delay="1.2s">
                <img class="index-up" src="images/arrow-up.png" alt="">
            </div>
        </div>
        <div class="swiper-slide page2" >
            <div class="was-bg ani" swiper-animate-effect="fadeIn" swiper-animate-duration="0.1s" swiper-animate-delay="0.3s">
                <img class="was-bg" src="images/wasBg.jpg" alt="">
            </div>
            <div class="was-text">
                <img class="wasit ani" src="images/wasIT.png" alt="" swiper-animate-effect="fadeIn" swiper-animate-duration="0.2s" swiper-animate-delay="0.4s">
                <img class="wasfarm ani" src="images/wasFarm.png" alt="" swiper-animate-effect="fadeIn" swiper-animate-duration="0.2s" swiper-animate-delay="0.6s">
            </div>
            <div class="was-star ani" swiper-animate-effect="bounceInDown bounceInRight " swiper-animate-duration="0.5s" swiper-animate-delay="0.6s">
                <img class="was-star" src="images/wasStar.png" alt="">
            </div>
            <div class="opcity ani" swiper-animate-effect="fadeInUp" swiper-animate-duration="0s" swiper-animate-delay="1.3s"></div>
            <div class="index-up ani infinite" swiper-animate-effect="bounceInUp" swiper-animate-duration="2s" swiper-animate-delay="1.2s">
                <img class="index-up" src="images/arrow-up.png" alt="">
            </div>
        </div>
        <div class="swiper-slide page3" >
             <div class="early-bg ani" swiper-animate-effect="fadeOut" swiper-animate-duration="0.1s" swiper-animate-delay="5s">
                 <img class="early-bg ani" src="images/earlyBg.jpg" alt="" swiper-animate-effect="fadeIn" swiper-animate-duration="0s" swiper-animate-delay="0.1s">
             </div>
            <div class="early-bulid ani" swiper-animate-effect="zoomIn" swiper-animate-duration="0.5s" swiper-animate-delay="0.2s">
                <img  class="early-build ani" src="images/earlyBuilding.png" alt="" swiper-animate-effect="fadeOut" swiper-animate-duration="0.3s" swiper-animate-delay="2.5s">
            </div>
            <div class="early-title ani" swiper-animate-effect="fadeIn" swiper-animate-duration="0.5s" swiper-animate-delay="1s">
                <img class="early-title ani" src="images/earlyTitle.png" alt="" swiper-animate-effect="fadeOut" swiper-animate-duration="0.3s" swiper-animate-delay="2.5s">
            </div>
            <div class="early-bus ani" swiper-animate-effect="fadeOut" swiper-animate-duration="0.1s" swiper-animate-delay="5s">
                <img class="early-sta ani" src="images/lastBusStation.png" alt="" swiper-animate-effect="fadeIn" swiper-animate-duration="0.3s" swiper-animate-delay="3s">
                    <span class="ani" swiper-animate-effect="fadeIn" swiper-animate-duration="0s" swiper-animate-delay="3.5s"> <img class="early-bu ani" src="images/bus.png" alt="" swiper-animate-effect="slideOutLeft" swiper-animate-duration="1s" swiper-animate-delay="3.5s">
                        </span>
                <img class="early-av ani" src="images/lastBusAvatar.png" alt="" swiper-animate-effect="slideInRight" swiper-animate-duration="1s" swiper-animate-delay="3.8s">
                <img class="early-tit ani" src="images/lastBusTitle.png" alt="" swiper-animate-effect="fadeIn" swiper-animate-duration="1s" swiper-animate-delay="3.8s">
            </div>
            <div class="team">
                <img class="ani team-bg" src="images/myTeamBg.jpg" alt="" swiper-animate-effect="fadeIn" swiper-animate-duration="0.1s" swiper-animate-delay="5.0s">
                <img class="ani team-wall" src="images/myTeamWall.png" alt="" swiper-animate-effect="fadeIn" swiper-animate-duration="0.1s" swiper-animate-delay="5.0s">
                <img class="ani team-av" src="images/myTeamAvatar.png" alt="" swiper-animate-effect="fadeIn" swiper-animate-duration="0.1s" swiper-animate-delay="5.0s">
                <img class="ani team-text" src="images/myTeamTxt.png" alt="" swiper-animate-effect="zoomIn" swiper-animate-duration="0.8s" swiper-animate-delay="5.5s">
                <img class="ani team-text1" src="images/myTeamTxt01.png" alt="" swiper-animate-effect="zoomIn" swiper-animate-duration="0.8s" swiper-animate-delay="6.3s">
                <img class="ani team-text2" src="images/myTeamTxt02.png" alt="" swiper-animate-effect="zoomIn" swiper-animate-duration="0.8s" swiper-animate-delay="6.7s">
                <img class="ani team-text3" src="images/myTeamTxt03.png" alt="" swiper-animate-effect="zoomIn" swiper-animate-duration="0.8s" swiper-animate-delay="7.1s">
                <!--<img class="ani team-text4" src="images/myTeamTxt04.png" alt="" swiper-animate-effect="zoomIn" swiper-animate-duration="0.8s" swiper-animate-delay="7.5s">-->
                <img class="ani team-where" src="images/myteamWhereTxt.png" alt="" swiper-animate-effect="zoomIn" swiper-animate-duration="0.8s" swiper-animate-delay="7.9s">
            </div>
            <div class="index-up ani infinite" swiper-animate-effect="bounceInUp" swiper-animate-duration="2s" swiper-animate-delay="7.9s">
                <img class="index-up" src="images/arrow-up.png" alt="">
            </div>

        </div>
        <div class="swiper-slide page4" >
            <div id="one">
            <div class="light-offbg ani" swiper-animate-effect="fadeIn" swiper-animate-duration="0s" swiper-animate-delay="0.2s">
                <img class="light-offbg" src="images/lightOffBg.jpg" alt="">
            </div>
            <div class="light-off ani" swiper-animate-effect="fadeIn" swiper-animate-duration="0s" swiper-animate-delay="0.2s">
                <img class="light-off" src="images/lightOff.png" alt="">
            </div>
            <div class="light-off-title ani" swiper-animate-effect="slideInDown" swiper-animate-duration="0.5s" swiper-animate-delay="1s">
                <img class="light-off-title" src="images/cornerTitle.png" alt="">
            </div>
            <div class="light-click ani" swiper-animate-effect="fadeIn" swiper-animate-duration="0.5s" swiper-animate-delay="2s">
                <img class="light-click ani infinite" src="images/clickGuide.png" alt="" swiper-animate-effect="pulse" swiper-animate-duration="2s" swiper-animate-delay="2s">
            </div></div>

            <div id="two" style="display: none">
                <div class="light-on-bg ani" swiper-animate-effect="fadeIn" swiper-animate-duration="1s" swiper-animate-delay="1.5s">
                    <img class="light-on-bg" src="images/lightOnBg.jpg" alt="">
                </div>
                <div class="light-on ani" swiper-animate-effect="fadeIn" swiper-animate-duration="0s" swiper-animate-delay="0.1s">
                    <img class="light-on" src="images/lightOn.png" alt="">
                </div>
                <div class="light-flower ani" swiper-animate-effect="fadeIn" swiper-animate-duration="1s" swiper-animate-delay="0.5s">
                    <img class="light-flower" src="images/lightFlowers.png" alt="">
                </div>
                <div class="light-know ani" swiper-animate-effect="fadeIn" swiper-animate-duration="1s" swiper-animate-delay="1s">
                    <img class="light-know" src="images/weKnowYou.png" alt="">
                </div>
            </div>
            <div class="index-up ani infinite" swiper-animate-effect="bounceInUp" swiper-animate-duration="2s" swiper-animate-delay="1.2s">
                <img class="index-up" src="images/arrow-up.png" alt="">
            </div>
        </div>
        <div class="swiper-slide page5">
            <div class="about-bg ">
                <img class="about-bg" src="images/aboutBg.jpg" alt="">
            </div>
            <div class="about-city ani" swiper-animate-effect="fadeIn" swiper-animate-duration="0.5s" swiper-animate-delay="1.5s">
                <img class="about-city" src="images/footCity.jpg" alt="">
            </div>
            <div class="about-av ani" swiper-animate-effect="zoomIn" swiper-animate-duration="0.5" swiper-animate-delay="1.5s">
                <img class="about-av" src="images/footAvatar.png" alt="">
            </div>
            <div class="about-ta ani" swiper-animate-effect="fadeOut" swiper-animate-duration="0.5s" swiper-animate-delay="1.8s">
                <img class="about-ta ani" src="images/footTa.png" alt="" swiper-animate-effect="slideInLeft" swiper-animate-duration="1s" swiper-animate-delay="0.1s">
            </div>
            <div class="about-tx ani" swiper-animate-effect="fadeIn" swiper-animate-duration="1s" swiper-animate-delay="2s">
                <img class="about-tx" src="images/footTx.png" alt="">
            </div>

            
            <div class="index-up ani infinite" swiper-animate-effect="bounceInUp" swiper-animate-duration="2s" swiper-animate-delay="1.2s">
                <img class="index-up" src="images/arrow-up.png" alt="">
            </div>
        </div>
        <div class="swiper-slide page6" >
            <div class="about-bg ">
                <img class="about-bg" src="images/runBg.jpg" alt="">
            </div>
            <div class="run-av ani" swiper-animate-effect="zoomInDown" swiper-animate-duration="0.5" swiper-animate-delay="1.5s">
                <img class="run-av" src="images/runAvatar.png" alt="">
            </div>
            <div class="about-ta ani" swiper-animate-effect="fadeOut" swiper-animate-duration="0.5s" swiper-animate-delay="1.8s">
                <img class="about-ta ani" src="images/runTa.png" alt="" swiper-animate-effect="slideInLeft" swiper-animate-duration="1s" swiper-animate-delay="0.1s">
            </div>
            <div class="about-tx ani" swiper-animate-effect="fadeIn" swiper-animate-duration="1s" swiper-animate-delay="2s">
                <img class="about-tx" src="images/runTxt.png" alt="">
            </div>
            <div class="index-up ani infinite" swiper-animate-effect="bounceInUp" swiper-animate-duration="2s" swiper-animate-delay="1.2s">
                <img class="index-up" src="images/arrow-up.png" alt="">
            </div>


        </div>
        <div class="swiper-slide page7">
            <div class="salary-bg ani" swiper-animate-effect="fadeIn" swiper-animate-duration="0.5s" swiper-animate-delay="1s">
                <img class="salary-bg"  src="images/salaryBg.png" alt="">
            </div>
            <div class="salary-av ani" swiper-animate-effect="fadeIn" swiper-animate-duration="0.5s" swiper-animate-delay="1.2s">
                <img  class="salary-av" src="images/salaryAvatar.png" alt="">
            </div>
            <div class="about-ta ani" swiper-animate-effect="fadeOut" swiper-animate-duration="0.5s" swiper-animate-delay="1.8s">
                <img class="about-ta ani" src="images/salaryTa.png" alt="" swiper-animate-effect="slideInLeft" swiper-animate-duration="1s" swiper-animate-delay="0.1s">
            </div>
            <div class="about-tx ani" swiper-animate-effect="fadeIn" swiper-animate-duration="1s" swiper-animate-delay="2s">
                <img class="about-tx" src="images/salaryTxt.png" alt="">
            </div>
            <div class="index-up ani infinite" swiper-animate-effect="bounceInUp" swiper-animate-duration="2s" swiper-animate-delay="1.2s">
                <img class="index-up" src="images/arrow-up.png" alt="">
            </div>

        </div>
        <div class="swiper-slide page8" >
            <div class="intro-flower ani infinite" swiper-animate-effect="pulse" swiper-animate-duration="1s" swiper-animate-delay="0.1s">
                <img class="intro-flower" src="images/introFlowers.png" alt="">
            </div>
            <div class="intro-text ani">
                <div class="intro-bg">
                    <p>招商银行是世界500强企业，也是我国第一家完全有企业法人持股的股份制商业银行。</p>
                    <p>招银网络科技（简称招银科技）是招商银行的全资子公司，致力于为招商银行全球化发展提供强有力的软件开发及技术支持。公司以成为中国银行业最强大脑为己任，在彼此信任和尊重的基础上，追求高标准的交付和价值创造。现有深圳、杭州两家分支机构，共同担负着招商银行电子信息化的重任。</p>
                    <p>这里是中国最具活力的银行，这里是中国最优秀的金融IT团队之一。如果您足够优秀，那么这里将会是您智慧闪光、价值实现和梦想腾飞的舞台，我们热忱期待您的加盟。</p>
                </div>
            </div>
            <div class="intro-title ani">
                <img class="intro-title" src="images/introLogo.png" alt="">
            </div>
            <div class="intro-av ani">
                <img class="intro-av" src="images/introAvatar.png" alt="">
            </div>
            <div class="intro-star ani infinite" swiper-animate-effect="pulse" swiper-animate-duration="1s" swiper-animate-delay="0.1s">
                <img class="intro-star" src="images/introStar.png" alt="">
            </div>
            <div class="index-up ani infinite" swiper-animate-effect="bounceInUp" swiper-animate-duration="2s" swiper-animate-delay="1.2s">
                <img class="index-up" src="images/arrow-up.png" alt="">
            </div>
        </div>
        <div class="swiper-slide page9" >
            <div class="end-bg">
                <img class="end-bg" src="images/endBg.png" alt="">
            </div>
            <div class="end-cloud ani" swiper-animate-effect="fadeIn" swiper-animate-duration="1s" swiper-animate-delay="2s">
                <img class="end-cloud ani infinite" src="images/endCloudys.png" alt="" swiper-animate-effect="pulse" swiper-animate-duration="1s" swiper-animate-delay="2s">
            </div>
            <div class="end-bottom ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="1s" swiper-animate-delay="1.5s">
                <img class="end-bottom" src="images/endBottomTxt.png" alt="">
            </div>
            <div class="end-logo ani" swiper-animate-effect="fadeIn" swiper-animate-duration="1s" swiper-animate-delay="0.2s">
                <img class="end-logo" src="images/endLogo.png" alt="">
            </div>
            <div class="end-email ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="1s" swiper-animate-delay="1.5s">
                <img class="end-email" src="images/endMail.png" alt="">
            </div>
            <div class="end-text ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="1s" swiper-animate-delay="1.5s">
                <img class="end-text" src="images/endTxt.png" alt="">
            </div>
            <div class="end-click ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="1s" swiper-animate-delay="1.5s">
                <img class="end-click" src="images/endClickGuide.png" alt="">
            </div>
            <div class="end-av ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="1s" swiper-animate-delay="1.5s">
                <img class="end-av" src="images/endAvatar.png" alt="">
            </div>

        </div>

    </div>
    <!--&lt;!&ndash; 如果需要分页器 &ndash;&gt;-->
    <!--<div class="swiper-pagination"></div>-->

    <!--&lt;!&ndash; 如果需要导航按钮 &ndash;&gt;-->
    <!--<div class="swiper-button-prev"></div>-->
    <!--<div class="swiper-button-next"></div>-->

    <!-- 如果需要滚动条 -->
    <!--<div class="swiper-scrollbar"></div>-->
</div>

<script src="js/jquery-3.2.1.js"></script>
<script src="js/swiper.min.js"></script>
<script src="js/swiper.animate1.0.2.min.js"></script>
<!--<script src="js/index.js"></script>-->
<script src="js/app.js"></script>
</body>
</html>